<template>
	<div style="width:98%;margin:0 auto;">
		<div class="cardHead">
			<svg class="icon" aria-hidden="true">
				<use xlink:href="#icon-icon_file"></use>
			</svg>
			<div class="text">归档</div>
		</div>
		<div class="ClassfyList">
			<div class="Classfyitem" v-for="(item,index) in dataList" :key="index" @click="goArrayItem(index)">
				{{index}}<span>{{item}}</span>
			</div>
		</div>		
	</div>
</template>

<script>
	import {} from '../../assets/font/iconfont.js'
	export default {
		name: 'Archive',
		data() {
			return {
				dataList: [],
			}
		},
		mounted() {
			this.getData();
		},
		methods: {
			// 拉取数据
			getData() {
				this.$axios.post(this.HOST + '/api/indexPage').then(res => {
					let data = res.data.data;					
					let dateArr = [];
					// 遍历数组,提取目标字段
					for (let i = 0; i < data.length; i++) {
						let item = data[i].datetime;						
						let dateNew = item.split('T');
						let year = dateNew[0].split('-')
						dateArr.push(year[0])
					}
					// 统计每个字段出现的数量
					var map = {};
					var i = 0, len = dateArr.length;
					//循环查找
					for (; i < len; i++) {
						//数组里的i个元素
						var v = dateArr[i];
						//将数组的i个元素作为map对象的属性查看其属性值
						var counts = map[v];
						//如果map对象没有该属性，则设置该属性的值为1，有的话在其基础上再+1
						if (counts) {							
							map[v] += 1;
						} else {
							map[v] = 1;
						}
					}
					this.dataList = map
				}).catch(err => {console.log(err,'catch')})
			},
			// 点击跳转goArrayItem
			goArrayItem(e){
				let arr = {};
				arr.name = '归档';
				arr.archive = e;
				this.$emit("buttArchive",arr)
			}
		},
	}
</script>

<style>
</style>
